<template>
    <div class="">
        <van-icon name="arrow-left" @click="goBack" />
        电台
        <ul>
            <li v-for="item in radioUrl" :key="item.id" @click="selectPlayList(item)">
                 <div class="cover-num">
                        <img :src="item.pic_url" alt="">
                        <span>{{ (item.listenNum/10000) | numFilter(1) }}万</span>
                    </div>
                <span>{{item.title}}</span>
            </li>
        </ul>
       
    </div>
</template>

<script>
import axios from 'axios'
export default {
    data(){
        return{
            radioUrl:[]
        };
    },
    created(){
        this.getData();
    },
    methods:{
        getData(){
            axios.get("/api/radio/category",
            )
            .then(res => {
                console.log(res.data.data[0].list)
                this.radioUrl=res.data.data[0].list
            })
            .catch(err => {
                console.error(err); 
            })
        },
        goBack() {
          this.$router.go(-1);
        },
        selectPlayList(item){
            const id = item.id
            this.$router.push({
                path:`/jumpradio/${id}`
            })
        },
    }
}
</script>

<style scoped>
 .van-icon{
  position: absolute;
  top: 5px;
  left: 5px;
  z-index: 999;
  font-size: 40px;
}
</style>